@import "~antd/lib/style/themes/default.less";
@import "../../../utils/utils.less";

.systemRoleWrapper {
  display: flex;

  .systemRole {
    width           : 300px;
    border-radius   : 4px;
    background-color: #fff;
    box-shadow      : 0px 2px 4px 0px rgba(68, 71, 74, 0.07);
    margin-right    : 16px;
  }

  .systemRoleTitle {
    padding      : 10px 15px;
    border-bottom: 1px solid #d6e1ee;
  }

  .authSettingBody {
    width           : calc(100% - 316px);
    background-color: #fff;
    height          : 100%;
  }
}

.roleName {
  display        : flex;
  justify-content: space-between;
  align-items    : center;

  &>div {
    width        : 230px;
    overflow     : hidden;
    text-overflow: ellipsis;
    word-break   : break-all;
    white-space  : nowrap;
  }
}

.projectList {
  :global {
    .ant-card-meta-description {
      color      : @text-color-secondary;
      height     : 44px;
      line-height: 22px;
      overflow   : hidden;
    }
  }

  .cardTitle {
    font-size: 0;

    a {
      color         : @heading-color;
      margin-left   : 12px;
      line-height   : 24px;
      height        : 24px;
      display       : inline-block;
      vertical-align: top;
      font-size     : @font-size-base;

      &:hover {
        color: @primary-color;
      }
    }
  }

  .projectGrid {
    width: 33.33%;
  }

  .projectItemContent {
    display    : flex;
    margin-top : 8px;
    overflow   : hidden;
    font-size  : 12px;
    height     : 20px;
    text-align : right;
    line-height: 20px;
    .textOverflow();

    a {
      color  : @text-color-secondary;
      display: inline-block;
      flex   : 1 1 0;
      .textOverflow();

      &:hover {
        color: @primary-color;
      }
    }

    .datetime {
      color  : @disabled-color;
      display: block;
      float  : right;
    }
  }
}

.noRole {
  height         : calc(100vh - 338px);
  display        : flex;
  align-items    : center;
  justify-content: center;
}

.systemRoleList {
  height    : calc(100vh - 375px);
  overflow-x: hidden;
  overflow-y: auto;
}

.AuthModuleWrap {
  height  : calc(100vh - 394px);
  overflow: auto;
  width   : 800px;
}

.systemFormBtn {
  padding   : 12px 36px;
  box-shadow: 0px -2px 4px 0px rgba(68, 71, 74, 0.07);
  text-align: right;
}

.systemRoleBtn {
  padding: 12px 16px;

  button {
    width: 100%;
  }
}

.tree {
  border       : 1px solid #ccc;
  padding-right: 20px;

  :global {
    .ant-tree-switcher-noop:after {
      content  : "." !important;
      color    : #D2D2D2;
      font-size: 42px;
      position : relative;
      top      : -13px;
    }

    .ant-tree-title {
      color      : #777777;
      font-family: Microsoft Yahei, Hiragino Sans GB, WenQuanYi Micro Hei, sans-serif;
    }

    .ant-tree-switcher_open {
      .anticon {
        color: #52ACE2;
      }
    }

    .ant-tree-switcher_close {
      .anticon {
        color: #D2D2D2;
      }
    }

    .ant-tree-checkbox {
      float: right;
    }
  }
}
